﻿@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
}

<link href="~/lib/layui/css/layui.css" rel="stylesheet" />
<script src="~/lib/layui/layui.js"></script>
<script src="~/lib/jquery/dist/jquery.js"></script>




<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>IMES</title>
</head>
<body>
    <div class="layui-panel">
        <div style="padding: 32px;">
            <div class="layui-form-item">
                <div class="layui-inline">
                    <label class="layui-form-label" style="font-weight: bold;float: left;">出库单</label>
                    <div style="margin-left: 600px;">
                        <input type="text" placeholder="出库单号" id="outboundOrderNumber" style="line-height:25px;">
                        <button class="layui-btn layui-bg-blue" onclick="get()" style="height:29px;line-height:14px">查询</button>
                        <button class="layui-btn" lay-on="test-page-custom" style="height:29px;line-height:14px">新建</button>
                    </div>
                </div>
                <table class="layui-table">
                    <thead>
                        <tr>
                            <th>
                                <input id="checkAll" type="checkbox" name="check">
                            </th>
                            <th>出库单主键Id</th>
                            <th>出库单号</th>
                            <th>出库类型</th>
                            <th>出库时间</th>
                            <th>审批状态</th>
                            <th>缩略图</th>
                            <th>附件</th>
                            <th>备注</th>
                            <th>创建日期</th>
                            <th>创建人</th>
                            <th>修改人</th>
                            <th>修改时间</th>
                        </tr>
                    </thead>
                    <tbody id="body">
                    </tbody>
                </table>
            </div>
        </div>
        <div class="layui-panel" style="margin-top: 20px;">
            <table class="layui-table">
                <thead>
                    <tr>

                        <th>产品名称</th>
                        <th>产品编号</th>
                        <th>库存单位</th>
                        <th>产品规格</th>
                        <th>最大库存</th>
                        <th>最小库存</th>
                        <th>安全库存</th>
                        <th>出库数量</th>
                        <th>当前库存数量</th>
                    </tr>
                </thead>
                <tbody id="body1">
                </tbody>
            </table>


        </div>
    </div>
    <!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
    <script src="//unpkg.com/layui@2.9.20/dist/layui.js"></script>
    <script>
        $(function () {
            getList();
        })
        //出库单列表显示
        function getList() {
            $.ajax({
                url: '@ViewBag.GlennQuigmrire' + "/api/OutboundOrder/OutboundOrderList",
                type: "post",
                data: JSON.stringify({
                    outboundOrderNumber: $("#outboundOrderNumber").val() || "",
                }),
                dataType: "json",
                contentType: "application/json",
                success: function (res) {
                    console.log(res)
                    $("#body").empty();
                    $(res.data).each(function (item) {
                        $("#body").append(`<tr>

                               <td>
                                         <input class="itemCheckbox"  value="${this.outboundOrderId}" type="checkbox" name="check"></input>
                               </td>
                               <td>${this.outboundOrderId}</td>
                                       <td>${this.outboundOrderNumber}</td>
                                       <td>${this.outboundOrderTypeName}</td >
                                        <td>${this.outbroundOrderDate}</td>

                                         <td>${this.examineStatus==0?"待审核":(this.examineStatus==1?"审核通过":(this.examineStatus==2?"审核被拒绝":(this.examineStatus==3?"被拒绝":"")))}</td>
                                         <td><img src="${this.imageUrl}" style="width: 60px;height: 60px;"></img></td>
                                         <td>${this.fileUrl}</td >
                                       <td>${this.remark}</td>
                                       <td>${this.createDate}</td>
                                       <td>${this.createName}</td>
                                       <td>${this.updateName == null ? "" : this.updateName}</td>
                                       <td>${this.updateDate == null ? "" : this.updateDate.substr(0, 19).replace("T", " ")}</td>
                           </tr>`)
                    })
                }
            })
        }

       




    </script>
</body>
</html>
<!-- 请勿在项目正式环境中引用该 layui.js 地址 -->
<script src="//unpkg.com/layui@2.9.20/dist/layui.js"></script>
<script>

    layui.use(function () {
        var $ = layui.$;
        var layer = layui.layer;
        var util = layui.util;
        var form = layui.form;
        // 事件
        util.on('lay-on', {
            'test-page-custom': function () {
                layer.open({
                    type: 2,
                    area: ['1300px', '750px'],
                    shadeClose: true,
                    title: '入库单（新建）',
                    content: '/OutboundOrder/OutboundAddView',

                });
            }
        });

        //全选反选
        $('#checkAll').click(function () {
            $('.itemCheckbox').prop('checked', $(this).prop('checked'));
            form.render('checkbox');



        });
        //单项选择时检查是否全选
        $('body').on('click', '.itemCheckbox', function () {
            if ($('.itemCheckbox:checked').length == $('.itemCheckbox').length) {
                $('#checkAll').prop('checked', true);
            } else {
                $('#checkAll').prop('checked', false);
            }
            form.render('checkbox');
        });

        //表格行点击事件获取当前行数据
        $('body').on('click', 'tr', function () {
            var data = $(this).children('td').map(function () {
                return $(this).text();
            }).get();
            console.log(data[1]);
            //调用AJAX获取产品数据放入表格body1中
            $.ajax({
                url: '@ViewBag.GlennQuigmrire' + "/api/OutboundOrder/OutboundOrderProductSearch",
                type: "post",
                data: JSON.stringify({ outboundOrderId: data[1] }),
                dataType: "json",
                contentType: "application/json",
                success: function (res) {
                    $("#body1").empty();
                    console.log(res)

                    //给产品表赋值
                    $(res.data).each(function () {

                        var colors1 = "";
                        if (this.stockUnit == 1) {
                            colors1 = "red";
                        } else if (this.stockUnit == 2) {
                            colors1 = "blue";
                        } else if (this.stockUnit == 3) {
                            colors1 = "green";
                        } else if (this.stockUnit == 4) {
                            colors1 = "pink";
                        } else if (this.stockUnit == 5) {
                            colors1 = "blue";
                        } else if (this.stockUnit == 6) {
                            colors1 = "orange";
                        } else if (this.stockUnit == 7) {
                            colors1 = "gray";
                        } else if (this.stockUnit == 8) {
                            colors1 = "black";
                        } else if (this.stockUnit == 9) {
                            colors1 = "pink";
                        }
                        $("#body1").append(`<tr>
                                                                 
                                                                  
                                                                   <td>${this.productName}</td>
                                                                   <td>${this.productNumber}</td>
                                                                   <td style="color:${colors1}" >${this.stockUnit}</td>
                                                                   <td>${this.productSpecification}</td>
                                                                  <td>${this.maxInventory}</td>
                                                                  <td>${this.minInventory}</td>
                                                                  <td>${this.saveInventory}</td>
                                                                  <td>
                                                                        <input type="text" disabled style="width: 100px" value="${this.outNum}" autocomplete="off" class="layui-input">
                                                                      </td>
                                                                  <td>${this.inventoryStore}</td>
                                                              </tr>`)
                    })
                }
            })


        });

      
    });

</script>


